<ui:composition template="/WEB-INF/templates/defaultLayout.xhtml" 
				xmlns="http://www.w3.org/1999/xhtml"
				xmlns:h="http://java.sun.com/jsf/html"
	  			xmlns:p="http://primefaces.org/ui" 
	  			xmlns:f="http://java.sun.com/jsf/core"
      			xmlns:ui="http://java.sun.com/jsf/facelets">

	<ui:define name="title">
		#{lang.getTrans("ui.mobile.product.title")}
	</ui:define>
	
	<ui:define name="layoutCenter">
		<h:form id="form">
			<p:growl id="growl" showDetail="true"/>
			<p:breadCrumb>
				<p:menuitem value="#{lang.getTrans('ui.mobile.common.bread.home')}" url="/home.xhtml"/>
				<p:menuitem value="#{lang.getTrans('ui.mobile.common.bread.product')}" url="/crud/product/productList.xhtml"/>
			</p:breadCrumb>
			<p:dataTable id="basic" var="product" value="#{productBean.products}" paginator="true" 
			rows="15" 	paginatorTemplate="{CurrentPageReport} {FirstPageLink} {PreviousPageLink} {PageLinks} 
			{NextPageLink} {LastPageLink} {RowsPerPageDropdown}" >
			
				<p:column id="idServiceEditDelete" style="width:14px; text-align:center;" sortBy="#{product.idProduct}">
					<f:facet name="header">	
						<p:commandButton style="width:18px;height:18px;" title="#{lang.getTrans('ui.mobile.common.new')}" 
						icon="ui-icon-circle-plus" action="#{productBean.toForm}"/>				
					</f:facet>
					<p:commandButton style="width:18px;height:18px;" title="#{lang.getTrans('ui.mobile.common.delete')}" 
						icon="ui-icon-trash" action="#{productBean.remover}" update="@form">  
   						<f:setPropertyActionListener target="#{productBean.product}" value="#{product}" />
					</p:commandButton>  
				</p:column>
				
				<p:column style="width:14px;">
					<p:commandButton style="width:18px;height:18px;" title="#{lang.getTrans('ui.mobile.common.edit')}" 
						icon="ui-icon-circle-triangle-e" action="#{productBean.toForm}">  
   						<f:setPropertyActionListener target="#{productBean.product}" value="#{product}" />  
					</p:commandButton>  							
				</p:column>
			
				<p:column id="cdCode" sortBy="#{product.cdCode}">
					<f:facet name="header">	#{lang.getTrans('ui.mobile.product.code')}  </f:facet>
					<h:outputText value="#{product.cdCode}"/>	
				</p:column>
				
				<p:column id="cdProduct" sortBy="#{product.cdProduct}">
					<f:facet name="header">	#{lang.getTrans('ui.mobile.product.name')}  </f:facet>
					<h:outputText value="#{product.cdProduct}"/>	
				</p:column>
				
				<p:column id="nrQuantity" sortBy="#{product.nrQuantity}">
					<f:facet name="header">	#{lang.getTrans('ui.mobile.product.quantity')}  </f:facet>
					<h:outputText value="#{product.nrQuantity}"/>	
				</p:column>
				
			</p:dataTable>
		</h:form>
	</ui:define>
</ui:composition>
